<template>
    <div>
        <!-- 车辆出站-出站查询 -->
        <div class="top-container">
            <div class="container">
                <div class="content">
                    <div class="block">
                        <span class="demonstration lf" style="line-height: 35px;padding-right: 10px;">出站时间起</span>
                        <el-date-picker style="width: 20%;float: left" format="yyyy 年 MM 月 dd 日 HH时 mm分 ss秒"  v-model="date" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期">
                        </el-date-picker>
                    </div>
                    <el-form ref="form" label-width="80px">
                        <el-col :span="4">
                            <el-form-item label="车牌号" label-width="80px">
                                <el-autocomplete v-model="carCodeTips" placeholder="" size="mini" :fetch-suggestions="querySearchCode"></el-autocomplete>
                            </el-form-item>
                        </el-col>
                        <el-col :span="4">
                            <el-form-item label="班次号" label-width="80px">
                                <el-input v-model="carClassCode" style='width: 130px;' size="mini"></el-input>                            </el-form-item>
                        </el-col>
                    </el-form>
                    <el-tabs v-model="activeName" style="margin-top: 0;">
                        <button class="check-btn rf" @click="searchBusList"><!-- " -->
                            <img src="../../assets/imgs/operation_btn_icon_chaxun_default.png" alt="" class="btn-img">
                            查询</button>
                    </el-tabs>
                </div>
                <div  style="border-bottom: 1px solid #eee; height: 1px;width: 100%" class="lf"></div>
                <el-row style="width: 100%" class="lf">
                    <el-col :span="24">
                        <avue-crud @current-change="rowChange" :data='objs' v-model="bearFruit" :page="page" :option="dataForm"></avue-crud>
                    </el-col>
                </el-row>
            </div>
        </div>
    </div>
</template>

<script>
import "../../assets/js/jquery.js";
// import TableData from "../../components/common/tableData";
// import qs from "qs";


export default {
    data: function(){
        return {
            date:{},
            vehinos:'',
            sc_times:'',
            objs:[],//用来显示数据的数组
            currentRow:"",//点击的是当前的第几行
            restaurants:[],
            activeName: '',
            values:'',
            qualified: "",
            carCodeTips: "",
            carClassCode: "",
            page: {
                pageSizes: [10, 20, 30, 40],//分页信息 pageSize
                total: 20,//总页数 totalRow
                currentPage: 1,//当前第几页 pageNumber

                pageSize: 10,//每一页加载多少条数据
            },
            carData:{},
            bearFruit:{},//最后写入push返回的数据
            operateTime:{
                labelWidth:70,
                column:[
                    {
                        label: "操作时间",
                        prop: "daterange",
                        type: "daterange",
                        startPlaceholder: '324',
                        endPlaceholder: '4324b',
                    },
                ]
            },
            dataForm:{
                page:true,
                highlightCurrentRow:true,
                align:'center',
                addBtn:false,//是否添加按钮
                delBtn:false,//是否添加删除按钮
                editBtn:false,//是否添加编辑按钮
                menu:false,//是否添加菜单按钮
                column:[
                    {
                        label:'班次号',
                        prop:'ban_ci_hao',
                    },
                    {
                        label:'车牌号',
                        prop:'vehino',
                    },
                    {
                        label:'进站人数',
                        prop:'che_shang_yi_you_ren_shu',
                    },
                    {
                        label:'本站凭票上车人数',
                        prop:'ben_zhan_ping_piao_ren_shu'
                    },
                    {
                        label:'本站免票上车人数',
                        prop:'ben_zhan_mian_piao_ren_shu',
                    },
                    {
                        label:'本站免票儿童数',
                        prop:'ben_zhan_mian_piao_er_tong',
                    },
                    {
                        label:'出站总人数',
                        prop:'chu_zhan_zhong_ren_shu',
                    },
                    {
                        label:'进站时间',
                        prop:'jin_zhan_shi_jian',
                    },
                    {
                        label:'发班时间',
                        prop:'fa_ban_shi_jian',
                    },
                    {
                        label:'出站时间',
                        prop:'chu_zhan_shi_jian',
                    },
                    {
                        label:'座位',
                        prop:'zuo_wei',
                    },
                    {
                        label:'道路运输证号',
                        prop:'dao_lu_yun_shu_zheng_hao',
                    },
                    {
                        label:'装备等级',
                        prop:'zhuang_bei_deng_ji',
                    },
                    {
                        label:'技术等级',
                        prop:'ji_shu_deng_ji',
                    },
                    {
                        label:'审核有效期',
                        prop:'shen_yan_you_xiao_qi',
                    },
                    {
                        label:'业户名称',
                        prop:'create_name',
                    },
                    {
                        label:'标志牌号码',
                        prop:'biao_zhi_pai_hao_ma',
                    },
                    {
                        label:'线路名称',
                        prop:'ye_hu_ming_cheng',
                    },
                    {
                        label:'途经线路',
                        prop:'tu_jing_xian_lu',
                    },
                    {
                        label:'配客站点',
                        prop:'pei_ke_zhan_dian',
                    },
                    {
                        label:'驾驶员姓名1',
                        prop:'jia_shi_yuan_1',
                    },
                    {
                        label:'从业资格证1',
                        prop:'chong_ye_zhi_ge_zheng_hao_1',
                    },
                    {
                        label:'驾驶证是否有效1',
                        prop:'jia_shi_zheng_shi_fou_you_xiao_1',
                        formatter:function(row){
                            return row.jia_shi_zheng_shi_fou_you_xiao_1 === '1' ? '有效' : '无效'
                        }
                    },
                    {
                        label:'驾驶员姓名2',
                        prop:'jia_shi_yuan_2',
                    },
                    {
                        label:'从业资格证2',
                        prop:'chong_ye_zhi_ge_zheng_hao_2',
                    },
                    {
                        label:'驾驶证是否有效2',
                        prop:'jia_shi_zheng_shi_fou_you_xiao_2',
                        formatter:function(row){
                            return row.jia_shi_zheng_shi_fou_you_xiao_2 === '1' ? '有效' : '无效'
                        }
                    },
                    {
                        label:'驾驶员姓名3',
                        prop:'jia_shi_yuan_3',
                    },
                    {
                        label:'从业资格证3',
                        prop:'chong_ye_zhi_ge_zheng_hao_3',
                    },
                    {
                        label:'驾驶证是否有效3',
                        prop:'jia_shi_zheng_shi_fou_you_xiao_3',
                        formatter:function(row){
                            return row.jia_shi_zheng_shi_fou_you_xiao_3 === '1' ? '有效' : '无效'
                        }
                    },
                    {
                        label:'是否系好安全带',
                        prop:'shi_fou_ji_hao_an_quan_dai',
                        formatter:function(row){
                            return row.shi_fou_ji_hao_an_quan_dai === '1' ? '是' : '否'
                        }
                    },
                    {
                        label:'是否超员',
                        prop:'shi_fou_chao_yuan',
                        formatter:function(row){
                            return row.shi_fou_chao_yuan === '1' ? '是' : '否'
                        }
                    },
                    {
                        label:'安检是否有效',
                        prop:'an_jian_shi_fou_you_xiao',
                        formatter:function(row){
                            return row.an_jian_shi_fou_you_xiao === '1' ? '是' : '否'
                        }
                    },
                    {
                        label:'行驶证是否有效',
                        prop:'xing_shi_zheng_shi_fou_you_xiao',
                        formatter:function(row){
                            return row.xing_shi_zheng_shi_fou_you_xiao === '1' ? '是' : '否'
                        }
                    },
                    {
                        label:'是否配载危险品',
                        prop:'shi_fou_pei_zai_wei_xian_pin',
                        formatter:function(row){
                            return row.shi_fou_pei_zai_wei_xian_pin === '1' ? '是' : '否'
                        }
                    },
                ]
            }
        }
    },
    methods:{
//点击查询
        searchBusList(){
            var self = this;
            var checkDate = self.date[0];
            var checkDate1 = self.date[1];
            this.postRequest("/stationmanage/outbound/bus/list",
                {
                    filterRules: JSON.stringify([ //that.checkDate == "" ? that.dateToString(new Date) : that.dateToString(that.checkDate)
                        {"field":"bus_plan_out_bound_log.create_time","op":"dge","value":checkDate === undefined || checkDate === ''?self.dateToString(new Date) : self.dateToString(checkDate)
                        },
                        {"field":"bus_plan_out_bound_log.create_time","op":"dle","value":checkDate1 === undefined || checkDate1 === ''?self.dateToString(new Date) : self.dateToString(checkDate1)
                        },
                        {"field":"vehi_no","op":"eq","value":this.carCodeTips},{"field":"ban_ci_hao","op":"eq","value":this.carClassCode}
                      /*测试数据*/
                        /*{"field":"bus_plan_out_bound_log.create_time","op":"dge","value":"2018-08-31 00:00:00"},
                        {"field":"bus_plan_out_bound_log.create_time","op":"dle","value":"2018-08-31 23:59:59"},
                        {"field":"vehi_no","op":"eq","value":"粤A12345"},
                        {"field":"ban_ci_hao","op":"eq","value":"0103"}*/
                    ]),order: 'desc',page: this.page.currentPage,rows: '10'
                },
            ).then(target => {
                console.log(target);
                var tag = target.data.list;
                //页码大小
                this.page.pageSize = target.data.pageSize;
                //页码数
                this.page.pageNumber = target.data.pageNumber;
                //总页数
                this.page.total = target.data.totalRow;
                this.objs = tag;
            });
        },
        // 默认加载列表
        loadList(){
            this.postRequest("/stationmanage/outbound/bus/list",{
                page: this.page.currentPage,rows: '10',order: 'desc'
                },
            )
                .then(target => {
                    console.log(target);
                    var tag = target.data.list;
                    //页码大小
                    this.page.pageSize = target.data.pageSize;
                    //页码数
                    this.page.pageNumber = target.data.pageNumber;
                    //总页数
                    this.page.total = target.data.totalRow;

                    this.objs = tag;

                });
        },
        //获取焦点车牌号自动下拉提示
        querySearchCode(queryString, cb) {
            var restaurants = this.restaurants;
            var results = queryString ? restaurants.filter(this.createFilter(queryString)) : restaurants;
            // 调用 callback 返回建议列表的数据
            cb(results);
        },
        createFilter(queryString) {
            return (restaurant) => {
                return (restaurant.value.toLowerCase().indexOf(queryString.toLowerCase()) === 0);
            };
        },
        loadAll() {
            return [ ];
        },
        searchCode(){
            this.postRequest("/sch/data/bus_vehicle/listWithSpell")
                .then(target => {
                    console.log(target.data);
                    var tag = target.data;
                    for(var i=0;i<tag.length;i++){
                        // console.log(tag[i].vehi_no);
                        // console.log(this.loadAll.value);
                        this.restaurants.push({"value":tag[i].vehi_no});
                    }
                });
        },
        rowChange(val){
            console.log(val);
            this.page.currentPage = val;
            this.loadList();
        },
    },
    computed:{},
    watch:{},
    mounted() {
        this.loadList();
        this.searchCode();
        this.$emit("sendActive","3-2");
        this.restaurants = this.loadAll();
        // this.$emit("sendTag",2);
    }
}
</script>
<style scoped src="../../assets/css/inoutManage/outboundSearch.css">
</style>
